// import PropTypes from "prop-types";
import React, { memo, useEffect } from "react";
import { shallowEqual, useDispatch, useSelector } from "react-redux";
import { fetchEntireRoomListAction } from "@/store/modules/entire/actionCreator";
import EntireRoomWrapper from "./style";
import RoomItem from "@/components/room-item";
const EntireRoom = memo((props) => {
  const dispath = useDispatch();
  useEffect(() => {
    dispath(fetchEntireRoomListAction());
  }, [dispath]);

  const { pageList, isLoading } = useSelector((state) => {
    return {
      pageList: state.entire.pageList,
      isLoading: state.entire.isLoading,

      //   currentPage: state.entire?.currentPage,
      //   totalPage: state.entire?.totalPage,
    };
  }, shallowEqual);
  console.log("pageList", pageList);
  return (
    <EntireRoomWrapper>
      <div className="list">
        {pageList &&
          pageList.map((item) => {
            return <RoomItem roomObj={item} key={item._id} itemWidth="20%" />;
          })}
      </div>
      {isLoading && <div className="cover"></div>}
    </EntireRoomWrapper>
  );
});

// EntireRoom.propTypes = {};

export default EntireRoom;
